  <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>

  <script>
  $(document).ready(function() {
    $("#accordion").accordion();
    
    $("h3", "#accordion").click(function(e) {
            var contentDiv = $(this).next("div");
            contentDiv.load($(this).find("a").attr("href").replace(/\.php/,'.ajax.php'));      
    });   
    var ele = $("h3:first", "#accordion")
    var contentDiv = ele.next("div");
    contentDiv.load(ele.find("a").attr("href").replace(/\.php/,'.ajax.php'));
    
  });
  </script>

<div style="float:right;width:300px;padding-left:5px;height:800px" id="accordion">

	<h3><a href="/breakdown.php?by=year&order=count&in=d">By Year</a></h3>
	<div>
		<p style="height:230px">Loading...</p>
	</div>

	<h3><a href="/breakdown.php?by=category&order=count&in=d">By Category</a></h3>
	<div>
		<p style="height:230px">Loading...</p>
	</div>

	<h3><a href="/breakdown.php?by=myriad&order=count&in=d">By Myriad</a></h3>
	<div>
		<p style="height:230px">Loading...</p>
	</div>

	<h3><a href="/breakdown.php?by=month&order=name&in=a">By Month</a></h3>
	<div>
		<p style="height:230px">Loading...</p>
	</div>

	<h3><a href="/breakdown.php?by=user_id&order=count&in=d">By Contributor</a></h3>
	<div>
		<p style="height:230px">Loading...</p>
	</div>

	<h3><a href="/breakdown.php?by=cluster2&order=count&in=d">By Automatic Cluster2</a></h3>
	<div>
		<p style="height:230px">Loading...</p>
	</div>

</div>
